<template>
	<view class="body">
		<view class="pay">
			<text class="u-font-40">
                ￥<text class="num">{{money}}</text>
            </text>
            <view class="u-font-28">结算金额</view>
		</view>
		
		<view class="box">
			<view class="item" @click="choosePayType(1)">
				<view class="item-left">
                    <image src="../../static/icon/pay_01.png" class="pay-icon"></image>
					<view>微信支付</view>
				</view>
                <image :src="payType == 1 ? '../../static/icon/choose.png' : '../../static/icon/choose_02.png'" class="choose-01"></image>
			</view>
            <view class="item" v-if="(!from || from == 2) && balance > 0" @click="choosePayType(2)">
            	<view class="item-left">
                    <image src="../../static/icon/pay_02.png" class="pay-icon"></image>
            		<view>账户余额 <text class="price">￥{{ balance }}</text></view>
            	</view>
                <image :src="payType == 2 ? '../../static/icon/choose.png' : '../../static/icon/choose_02.png'" class="choose-01"></image>
            </view>
            <view class="item" v-if="!from" @click="choosePayType(3)">
            	<view class="item-left">
                    <image src="../../static/icon/pay_03.png" class="pay-icon"></image>
            		<view>找人代付</view>
            	</view>
                <image :src="payType == 3 ? '../../static/icon/choose.png' : '../../static/icon/choose_02.png'" class="choose-01"></image>
            </view>
            <view class="item" v-if="(!from || from == 2) && balance > 0" @click="choosePayType(4)">
            	<view class="item-left">
                    <image src="../../static/icon/pay_04.png" class="pay-icon"></image>
            		<view>微信+账户余额</view>
            	</view>
                <image :src="payType == 4 ? '../../static/icon/choose.png' : '../../static/icon/choose_02.png'" class="choose-01"></image>
            </view>
		</view>
        
		<view class="btn" v-if="payType != 3" @click="$noMultipleClicks(pay)">确认</view>
		<button open-type="share" class="save" v-if="payType == 3">确认</button>
	</view>
</template>

<script>
	export default {
		data() {
			return {
                noClick:true,//连点
				id: "",
				money: 0,
				balance: 0,//余额
				payInfo: '',
				
                check: true,
				payType: 1, //1微信 2余额 3代付 4微信+余额
				info: {},
                total: '',
                data: {},
				from: '',//1recharge充值支付  2分享代付
				coupon_id: '',
			};
		},
		onShareAppMessage(res) {
			return {
		        title: '东北亚物流',
		        path: `/pages/pay/pay?from=2&id=${this.id}&money=${this.money}&coupon_id=${this.coupon_id}`
			}
		},
		onLoad(option) {
			console.log('option',option)
			// 扫码支付
			if (option.scene) {
				let d = decodeURIComponent(option.scene).split('&').toString()
				console.log(d)
			    if (d) {
					let dd = d.split(',')
					console.log(dd)
			        this.id = dd[0]
			        this.money = dd[1]
			        this.coupon_id = dd[2]
			    }
			}
			
			
            if (option.id) {
                this.id = option.id
                this.money = option.money
            }
			if (option.from) {
				this.from = option.from
			}
			if (option.coupon_id) {
				this.coupon_id = option.coupon_id
			}
			if (option.balance) {
				this.balance = option.balance
			}
			
		},
		onShow() {
			if (this.$getSync('userToken')) {
				this.getData()
			} else {
				this.$gTo(`/pagesA/login/login`)
			}
		},
		methods: {
			choosePayType(num) {
				this.payType = num
			},
			
			getData() {
				this.$ajax('user_recharge', {
					user_token: this.$getSync('userToken'),
				}).then(ret => {
					if (ret.success == 1000) {
						this.balance = ret.detail.balance
					} else {
						this.$toast(ret.msg);
					}
				});
			},
			
			pay() {
				var that = this
				this.$ajax('wxpay', {
					user_token: this.$getSync('userToken'),
					order_id: this.id,
					method: this.payType,//1微信支付 2余额支付 4混合支付
					coupon_id: this.coupon_id,//优惠券id
				}).then(ret => {
					if (ret.success == 1000) {
						that.payInfo = ret.detail
						console.log(that.payInfo)
                        if (!that.payInfo.timeStamp) {
                            that.$toast(ret.msg);
                            setTimeout(() => {
								if (that.from == 2) {
									that.$sTo(`/pages/tabbar/index`)
								} else {
									uni.navigateBack({
									    delta: 2
									})
								}
                            }, 300)
                        } else {
                            if (ret.detail) {
                                uni.requestPayment({
                                	provider: 'wxpay',
                                	timeStamp: that.payInfo.timeStamp,
                                	nonceStr: that.payInfo.nonceStr,
                                	package: that.payInfo.package,
                                	signType: 'MD5',
                                	paySign: that.payInfo.paySign,
                                	success: function(res) {
                                        that.$toast('支付成功！');
                                        setTimeout(() => {
											if (that.from == 2) {
												that.$sTo(`/pages/tabbar/index`)
											} else {
												uni.navigateBack({
												    delta: 3
												})
											}
                                        }, 300)
                                	},
                                	fail: function(err) {
                                        that.$toast('支付失败！');
                                	}
                                })
                            }
                        }
					} else {
						that.$toast(ret.msg);
					}
				});
			},
            
            choose() {
                this.check = !this.check;
                // if (this.check) {
                //     let balance = Number(this.info.data.balance)
                //     if (balance >= balancePay) {
                //         this.money = (this.money - (balancePay / 100)).toFixed(2)
                //     } else {
                //         this.money = (this.money - (balance / 100)).toFixed(2)
                //     }
                // } else {
                //     this.money = this.total
                // }
            },
		}
	};
</script>

<style lang="scss">
	
	
	page {
		background-color: #eef1f6;
	}

	.body {
		padding: 30rpx;
        font-size: 30rpx;
	}

	.pay {
		padding: 70rpx 0;
		text-align: center;

		text {
			font-weight: bold;
		}

		.num {
			font-size: 60rpx;
		}
	}

	.box {
		background-color: #FFFFFF;
		padding: 15rpx 30rpx;
		border-radius: 20rpx;
	}
    
    .item{
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 30rpx 0;
        border-bottom: 2rpx solid #ececec;
    }
    .item:last-child{
        border-bottom: none;
    }
    .item-left {
    	display: flex;
        justify-content: flex-start;
        align-items: center;
        font-size: 28rpx;
        font-weight: bold;
    }
    .pay-icon {
    	width: 41rpx;
    	height: 40rpx;
        margin-right: 15rpx;
    }
    .price{
        color: #ff5f2b;
        padding-left: 5rpx;
    }
    .choose-01{
        width: 41rpx;
        height: 41rpx;
    }

	.btn{
	    font-size: 34rpx;
	    color: #fff;
	    text-align: center;
	    padding: 25rpx;
	    background-color: #00457f;
	    border-radius: 50rpx;
	    margin-top: 70rpx;
	}
	
	.save {
		font-size: 34rpx;
		color: #fff;
		text-align: center;
		padding: 5rpx;
		background-color: #00457f;
		border-radius: 50rpx;
		margin-top: 70rpx;
	}
	
</style>
